<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>添加合同</title>
    <link rel="stylesheet" type="text/css" href="../static/css/bootstrap.css"/>
    <link rel="stylesheet" href="../static/css/index.css">
    <style>
        tr td, table {
            border: 1px solid #000;
            border-collapse: collapse;
            text-align: center;
        }

        #tr1 {
            color: blue;
        }

        #top {
            margin-left: 100px;
            margin-top: 100px;
        }

        　　tr:nth-child(2n) {
            　　　　background-color: #2AABD2;
        }

        　　tr:nth-child(2n+1) {
            　　　　background-color: #3E8F3E;
        }


    </style>
</head>
<body>

<div id="top">

    <table width="900px">

        <tr>
            <td>
                <table style="margin-left: 300px">
                    <tr>
                        <td>
                            合同类型：
                        </td>
                        <td>
                            <select v-model="contract.type">
                                <option value="原始合同">原始合同</option>
                                <option value="续费合同">续费合同</option>
                            </select>*
                        </td>
                    </tr>
                    <tr>
                        <td>
                            合同编号：
                        </td>
                        <td>
                            <input type="text" v-model="contract.id">
                            <input type="button" @click="getNumber" value="点击获取随机编号">*
                        </td>
                    </tr>
                    <tr>
                        <td>
                            付款金额：
                        </td>
                        <td>
                            <input type="text" v-model="contract.money">*
                        </td>
                    </tr>
                    <tr>
                        <td>
                            合同状态：
                        </td>
                        <td>

                            <select v-model="contract.paystate">
                                <option value="未付款">未付款</option>
                                <option value="已付款">已付款</option>
                                <option value="已付清">已付清</option>
                            </select>*
                        </td>
                    </tr>
                    <tr>
                        <td>
                            签约日期：
                        </td>
                        <td>
                            <input type="date" v-model="contract.startDate">*
                        </td>
                    </tr>
                    <tr>
                        <td>
                            结束日期：
                        </td>
                        <td>
                            <input type="date" v-model="contract.endDate">*
                        </td>
                    </tr>
                    <tr>
                        <td>
                            付款方式：
                        </td>
                        <td>
                            <select v-model="contract.payway">
                                <option>微信支付</option>
                                <option>支付宝支付</option>
                                <option>银行卡转账</option>
                            </select>*
                        </td>
                    </tr>
                    <tr>
                        <td>
                            支付时间：
                        </td>
                        <td>
                            <input type="date" v-model="contract.payDate">*
                        </td>
                    </tr>
                </table>
            </td>

        </tr>
        <tr>
            <td>

                <table style="float: left;margin-left: 10px;margin-right: 50px;width: 400px">

                    <tr>
                        <td>
                            <input type="button" value="卖方（乙方）">*
                        </td>
                    </tr>
                    <tr>
                        <td>
                            公司名称：<input type="text" v-model="contractInfo.buyName" @blur="getCompany">
                            <div>{{msg}}</div>
                        </td>
                    </tr>
                    <tr>
                        <td>
                            公司地址：<input type="text" v-model="contractInfo.buyAddress">
                        </td>
                    </tr>
                    <tr>
                        <td>
                            联系电话：<input type="tel" v-model="contractInfo.buyTel">
                        </td>
                    </tr>
                    <tr>
                        <td>
                            公司邮箱：<input type="email" v-model="contractInfo.buyEmail">
                        </td>
                    </tr>
                    <tr>
                        <td>
                            公司网址：<input type="url" v-model="contractInfo.buyUrl">
                        </td>
                    </tr>
                    <tr>
                        <td>
                            负责人&nbsp&nbsp&nbsp&nbsp;：<input type="text" v-model="contractInfo.buyUser">
                        </td>
                    </tr>
                    <tr>
                        <td>
                            负责人电话：<input type="tel" v-model="contractInfo.buyUserTel">
                        </td>
                    </tr>
                    <tr>
                        <td>
                            负责人邮箱：<input type="email" v-model="contractInfo.buyUserEmail">
                        </td>
                    </tr>

                </table>

                <table style="width: 400px">
                    <tr>
                        <td>
                            <input type="button" value="买方（甲方）">*
                        </td>
                    </tr>
                    <tr>
                        <td>
                            公司名称：<input type="text" v-model="contractInfo2.buyName" @blur="getCompany2">
                            <span>{{msg2}}</span>
                        </td>
                    </tr>
                    <tr>
                        <td>
                            公司地址：<input type="text" v-model="contractInfo2.buyAddress">
                        </td>
                    </tr>
                    <tr>
                        <td>
                            联系电话：<input type="tel" v-model="contractInfo2.buyUserTel">
                        </td>
                    </tr>
                    <tr>
                        <td>
                            公司邮箱：<input type="email" v-model="contractInfo2.buyEmail">
                        </td>
                    </tr>
                    <tr>
                        <td>
                            公司网址：<input type="url" v-model="contractInfo2.buyUrl">
                        </td>
                    </tr>
                    <tr>
                        <td>
                            负责人&nbsp&nbsp&nbsp&nbsp;：<input type="text" v-model="contractInfo2.buyUser">
                        </td>
                    </tr>
                    <tr>
                        <td>
                            负责人电话：<input type="tel" v-model="contractInfo2.buyUserTel">
                        </td>
                    </tr>
                    <tr>
                        <td>
                            负责人邮箱：<input type="email" v-model="contractInfo2.buyUserEmail">
                        </td>
                    </tr>

                </table>
            </td>

        </tr>
        <tr class="panel-footer">
            <td>
<!--                <input style="width: 100px" type="button" @click="addInfo" value="添加信息">-->

                <template>
                <span class="dialog-footer">
                    <el-button type="primary" size="small" @click="addInfo">添加信息</el-button>
                </span>
                </template>
            </td>
        </tr>
    </table>
</div>
<script src="../static/js/vue.js"></script>
<script src="../static/js/axios.min.js"></script>
<script src="../static/js/index.js"></script>
<script>
    new Vue({
        el: "#top",
        data: {
            contract: {
                //合同编号
                id: '',
                //员工id
                eId:'',
                //合同类型
                type: '',
                //签约时间
                startDate: '',
                //结束时间
                endDate:'',
                //金额
                money: '',
                //付款方式
                payway:'',
                //卖方id
                buyId: '',
                //卖方id
                sellId: '',
                //支付时间
                payDate:'',
                //支付状态
                paystate: '',
            },
            contractInfo: {
                //合同编号
                id: '',
                buyName:'',
                //公司地址
                buyAddress: '',
                //联系电话
                buyTel: '',
                //公司邮箱
                buyEmail: '',
                //公司网址
                buyUrl: '',
                //负责员工
                buyUser: '',
                //员工电话号
                buyUserTel: '',
                //员工邮箱
                buyUserEmail: '',

            },
            contractInfo2: {
                //合同编号
                id: '',
                //买房名称
                buyName: '',
                //公司地址
                buyAddress: '',
                //联系电话
                buyTel: '',
                //公司邮箱
                buyEmail: '',
                //公司网址
                buyUrl: '',
                //负责员工
                buyUser: '',
                //员工电话号
                buyUserTel: '',
                //员工邮箱
                buyUserEmail: '',
            },
            msg:'',
            msg2:'',
        },
        methods: {
            getNumber() {
                axios.get("/getNumber.Contract").then(response => {
                    let data = response.data;
                    this.contract.id = data.value;
                })
            },
            getCompany() {
                axios.get("/getCompanyInfoByName.Contract?company=+"+this.contractInfo.buyName).then(response =>{

                    let data = response.data;
                    if (data.key == '1'){
                    this.contractInfo = data.value;
                    }else {
                        this.$message({
                            message: '没有该公司！请输入正确的公司名！',
                            type: 'warning'
                        });
                        this.contractInfo.buyUser = ''
                    }
                })
            },
            getCompany2() {
                axios.get("/getCompanyInfoByName.Contract?company=+"+this.contractInfo2.buyName).then(response =>{
                    let data = response.data;
                    console.log(data)
                    if (data.key == '1'){
                        this.contractInfo2 = data.value;
                    }else {
                        this.$message({
                            message: '没有该公司！请输入正确的公司名！',
                            type: 'warning'
                        });
                    }
                })
            },
            addInfo(){
                if (this.contract.type==''|| this.contract.id==''||this.contract.startDate==''||this.contract.endDate==''||this.contract.money==''||this.contract.payway==''||this.contract.payDate==''||this.contract.paystate==''||this.contractInfo.buyName==''||this.contractInfo.buyName==''){
                    this.$message({
                        message: '合同信息不全，添加失败！',
                        type: 'warning'
                    });
                }else {
                    this.realAddInfo();
                }
            },

            realAddInfo(){
               this.contract.buyId = this.contractInfo.id
               this.contract.sellId = this.contractInfo2.id
                console.log(this.contract)
                axios.post("/save.Contract",this.contract).then(response =>{
                    let data = response.data
                    if (data.key == '1'){
                        this.$confirm(
                            '合同添加成功，是否继续添加：',
                            '提示',
                            {confirmButtonText: '确定',
                                cancelButtonText: '取消',
                            }).then(() => {
                            location. reload()
                        }).catch((err) => {
                            location.href="paidContract.html"
                        });
                    }else {
                        this.$message({
                            message: '合同添加失败！',
                            type: 'warning'
                        });
                    }

                })
            }

        },
        // created() {
        //
        // }
    });
</script>
</div>

</body>
</html>